﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>xBim Viewer 2</title>
    <script src="/Scripts/xbim/xbim-viewer.debug.bundle.js"></script>
</head>
<body>
    <div id="content">
        <canvas id="viewer" width="900" height="600"></canvas>
        <div id="msg"></div>
        <div id="errors"></div>
        <div id="fps"></div>
        <div id="productId"></div>
 



        <script type="text/javascript">
            var check = xViewer.check();
            if (check.noErrors) {
                //start animation, listen to events and do all the funny stuff
                var viewer = new xViewer('viewer');

                viewer.on('loaded', function () {
                    //Hide any loaders you have used to keep your user excited
                    //while their precious models are being processed and loaded
                    //and start the animation.
                    viewer.start();
                });

                viewer.on('error', function (arg) {
                    var container = document.getElementById('errors');
                    if (container) {
                        //preppend error report
                        container.innerHTML = "<pre style='color:red;'>" + arg.message + "</pre> <br />" + container.innerHTML;
                    }
                });

                viewer.on('fps', function (fps) {
                    var span = document.getElementById('fps');
                    if (span) {
                        span.innerHTML = fps;
                    }
                });

                var timer = 0;
                viewer.on('pick', function (args) {
                    var id = args.id;

                    var span = document.getElementById('productId');
                    if (span) {
                        span.innerHTML = id;
                    }

                    //you can use ID for funny things like hiding or
                    //recolouring which will be covered in one of the next tutorials

                    var time = (new Date()).getTime();
                    if (time - timer < 200)
                        viewer.zoomTo(id);
                    timer = time;

                });
                viewer.on('mouseDown', function (args) {
                    viewer.setCameraTarget(args.id);
                });

                viewer.load('/res/ifc/Ghasem.wexBIM');

            }
            else {
                var msg = document.getElementById('msg');
                msg.innerHTML = '';
                for (var i in check.errors) {
                    var error = check.errors[i];
                    msg.innerHTML += "<div style='color: red;'>" + error + "</div>";
                }
            }
        </script>
    </div>
</body>
</html>